<script setup lang="ts">
import DemoBox from '@/components/DemoBox/DemoBox.vue';
import BasicUsing from './BasicUsing.vue';
import BasicUsingRaw from './BasicUsing.vue?raw';
import PageLayout from '@/components/PageLayout.vue';
import { EList } from 'exploria-ui';
</script>

<template>
    <PageLayout>
        <DemoBox :code="BasicUsingRaw" :libs="['lottie-web']" title="基本用法">
            <BasicUsing />
            <template #description>
                Lottie 相关网站:
                <EList
                    :data="[
                        {
                            label: 'Lottie 官网',
                            link: 'https://lottie.airbnb.tech/#/',
                        },
                    ]"
                >
                    <template #row="{ row }">
                        <a :href="row.link">{{ row.label }}</a>
                    </template>
                </EList>
            </template>
        </DemoBox>
    </PageLayout>
</template>
